<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">

    <title>我的评论</title>

    <link rel="stylesheet" href="../css/index.css">
</head>
<body>
<!--内容开始-->

<div id="post_list" class="post-list">
    <div v-for="post in posts">
        <article class="post-item">
            <section class="post-item-body">
                <div class="post-item-text">
                    <a class="post-item-title" :href="'one_post.html?'+post.id" target="_blank"
                       style="font-size: 28px" v-text="post.title">标题</a>
                    <p class="post-item-summary">
                        <a href="">
                            <img :src="post.url" style="width: 100px" class="avatar" alt="博主头像"/>
                        </a>
                    <div style="width: 600px;height: 85px">
                              <span class="cont">
                                  {{post.content}}
                              </span>
                    </div>
                    </p>
                </div>
                <footer class="post-item-foot">
                    <a href="" class="post-item-author"><span
                            style="font-size: 18px" v-text="post.nickname">作者</span></a>
                    <span class="post-meta-item">
                    <span style="font-size: 18px" v-text="post.duration">发帖时间</span>
                </span>
                    <a id="digg_control_15470778">
                            <span style="padding-top: 5px" class="resize">
                                <i style="color: #ffc600;left: 27px" class="glyphicon glyphicon-thumbs-up"></i>
                                <i class="glyphicon glyphicon-thumbs-up"></i>{{post.likenum}}</span>
                    </a>
                    <a>
                      <span style="padding-top: 5px" class="resize"><i
                              class="glyphicon glyphicon-comment"></i>{{post.commentnum}}</span>
                    </a>
                    <a>
                      <span style="padding-top: 5px" class="resize"><i
                              class="glyphicon glyphicon-eye-open"></i>{{post.viewnum}}</span>
                    </a>
                    <a>
                      <span style="padding-top: 5px" class="resize"><i
                              class="glyphicon glyphicon glyphicon-folder-open"></i>29</span>
                    </a>

                </footer>
            </section>
        </article>
        <hr style="width:650px">
    </div>
    <div style="text-align: center">
        <nav aria-label="Page navigation">
            <ul class="pagination">
                <li>
                    <a href="#" aria-label="Previous">
                        <span aria-hidden="true">&laquo;</span>
                    </a>
                </li>
                <li><a href="#">1</a></li>
                <li><a href="#">2</a></li>
                <li><a href="#">3</a></li>
                <li><a href="#">4</a></li>
                <li><a href="#">5</a></li>
                <li>
                    <a href="#" aria-label="Next">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                </li>
            </ul>
        </nav>
    </div>
</div>

<!--内容结束-->
</body>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
</html>